<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css" type="text/css">
    <link rel="stylesheet" href="mycss/regist.css" type="text/css">
    <title>注册</title>
</head>
<body>
    <div class="login clearfix">
        <div class="col-md-12 column">
            <h1 class="text-center" style="margin-top: 80px;">
                加入IAIA短视频
            </h1>
            <div role="form" style="margin-top: 80px;">
                <div class="form-group">
                    <label for="exampleInputEmail1">用户名</label>
                    <input type="text" class="form-control" name="username" id="username" />
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword1">密码</label>
                    <input type="password" class="form-control" name="password" id="password" />
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword1">性别</label>
                    <input type="text" class="form-control" name="sex" id="sex" />
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword1">邮箱</label>
                    <!-- <input type="password" class="form-control" name="email" id="password" />
                     -->
                     <div class="input-group">
                        <input type="number" class="form-control" placeholder="Your qq email" aria-describedby="basic-addon2" name="email" id="email">
                        <span class="input-group-addon" id="basic-addon2">@qq.com</span>
                      </div>
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword1">电话</label>
                    <input type="number" class="form-control"  id="phonenumber" />
                </div>
                <div class="row " style="padding-right:20px">
                    <button class="btn btn-primary btn-lg pull-right " onclick="register()">注册</button>
                </div>
                <div class="row " style="padding-right:20px">
                </div>
            </div>
        </div>
    </div>
    <script src="jQuery/jQuery-2.1.4.min.js"></script>
    <script src="bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript">
        function register() {
            if(checkNull()){
                var url = 'user/signup.do';
                var username = $('#username').val();
                var password = $('#password').val();
                var sex =$("#sex").val();
                var now =new Date();
                var signuptime=now.toLocaleDateString();
                var emailstr=$("#email").val();
                var email=emailstr+"@qq.email";
                var phonenumber=$("#phonenumber").val();
                var data = {
                    'username': username,
                    'password': password,
                    'sex':sex,
                    'signuptime':signuptime,
                    'email':email,
                    'phonenumber':phonenumber
                }
                $.ajax({
                    type: "post",
                    url: url,
                    dataType: "json",
                    data: data,
                    success: function (data) {
                        if (data.code == 1) {
                            window.location.href = "login.html";
                        } else {
                            
                        }
                    },
                    error: function () {
                        alert("连接服务器异常！");            
                    }
                })
            }
        }
        function checkNull(){
            if ($("#username").val()==""){
                alert("请输入账号！");
            }else{
                if($("#password").val()==""){
                    alert("请输入密码");
                }else{
                    if ($("#sex").val()=="null"){
                        alert("请输入性别");
                    }else{
                        if($("#phonenumber").val()=="null"){
                            alert("请输入手机号");
                        }else{
                            if($("#email").val()=="null"){
                                alert("请输入邮箱");
                                
                            }else{
                                if(IsSex($("#sex").val())){
                                   
                                    if(checkPhone($("#phonenumber").val())){
                                    
                                        return true;
                                    }
                                    else{
                                        alert("请输入正确电话号");
                                    }
                                }
                                else{
                                    alert("请输入正确性别");
                                }
                            }
                        }
                    }
                    
                }
            }
        }
        function IsSex(str) {
            var pattern = new RegExp("[/^男$|^女&/]");
           return pattern.test(str);
        }
        function checkPhone(str) {
            console.log(str);
            var mobile =str;
            var tel = /^0\d{2,3}-?\d{7,8}$/;
            var phone = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/; 
            if(mobile.length == 11){//手机号码
                if(phone.test(mobile)) {  
                  return true;
                }
                
            }
            return false;
        }
    </script>
</body>
</html>